<div nz-row>
  <!-- 顶部 -->
  <!-- 左侧title -->
  <div nz-col nzSpan="16" style="font-size: 16px">
    <div nz-row nzAlign="middle" nzGutter="8">
      <span nz-col style="font-weight: bold;">
        {{currentFeature}} / {{title}}
      </span>
      <div *ngIf="currentFeatureId > 0" nz-col> 包含前置操作: <nz-switch [ngModel]="featureData.hasPreAction"
          (ngModelChange)="handlePreactionChange($event)"></nz-switch>
      </div>

      <!-- <div>
        <input nz-input placeholder="请输入scenario或description" [(ngModel)]="searchKey" style="width: 250px;"
          (ngModelChange)="onSearchChange($event)" />
      </div> -->
    </div>
  </div>
  <div nz-col nzSpan="8">
    <div nz-row nzGutter="12" nzJustify="end">
      <div nz-col>
        <!-- 创建scenario -->
        <app-create-scenario [featureId]="currentFeatureId"></app-create-scenario>
      </div>
      <div>
        <!-- 设定关联 cenario-->
        <app-feature-addscenario *ngIf="currentFeatureId > 0"></app-feature-addscenario>
      </div>
    </div>
  </div>
</div>
<!-- 下方数据表格 -->
<nz-table #editRowTable [nzData]="tableData" [nzLoading]="tableLoading" [nzFrontPagination]="false" [nzTotal]="total"
  [nzPageSize]="pageSize" [(nzPageIndex)]="page" (nzQueryParams)="onQueryParamsChange($event)">
  <!-- 表头 -->
  <thead>
    <tr>
      <th>sort</th>
      <th>scenario</th>
      <th>description</th>
      <th>stepsNo.</th>
      <th nzWidth="20%">Action</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let data of editRowTable.data; let i = index;">
      <ng-container>
        <td>{{i+1}}</td>
        <td>{{data.scenario}}</td>
        <td>{{data.description}}</td>
        <td>{{data._count?.cases}}</td>
        <td>
          <a (click)="handleEdit(data.id)">编辑</a>
          <nz-divider nzType="vertical"></nz-divider>
          <a nz-popconfirm nzPopconfirmTitle="你确定删除当前Scenario吗?" (nzOnConfirm)="handleDelete(data.id)">删除</a>
          <br>
          <!-- <nz-divider nzType="vertical"></nz-divider> -->
          <!-- 查看测试步骤 -->
          <app-cases [scenarioId]="data.id"></app-cases>
          <nz-divider nzType="vertical"></nz-divider>
          <a (click)="handleCopy(data)">复制</a>
        </td>
      </ng-container>

    </tr>
  </tbody>
</nz-table>